import Vue from 'vue';
import Store from '@/views/price-base-goods/Store';
import { LIST_NAME, GOODS_TYPES } from '@/views/price-base-goods/constants';
import { HeaderForm, Table, EditModal, ImportModal } from '@/views/price-base-goods/components';
import { TOP_CHANNELS } from '@/constants';

Vue.component(HeaderForm.name, HeaderForm);
Vue.component(Table.name, Table);
Vue.component(EditModal.name, EditModal);
Vue.component(ImportModal.name, ImportModal);

export default {
  metaInfo: {
    title: '调价基础商品库',
  },
  data() {
    return {
      store: new Store([{ listName: LIST_NAME }]),
      topChannelList: TOP_CHANNELS,
    };
  },
  methods: {
    handleCurrentChange() {},
    ...['pageSizeChange', 'pageNumChange', 'queryList', 'onClose', 'onOpenEditModal', 'onOpenImportModal', 'onCloseImport', 'resetTable'].reduce(
      (prev, curr) => ({
        ...prev,
        [curr](e) {
          this.store[curr](e);
        },
      }),
      {},
    ),
  },
  computed: {
    ...['formQueryValue', 'list', 'querying', 'visible', 'formValue', 'importVisible'].reduce(
      (prev, curr) => ({
        ...prev,
        [curr]: {
          get() {
            if (curr === 'list') {
              const { data = [], ...restParams } = this.store[curr][LIST_NAME];
              this.store.querying = this.store[curr][LIST_NAME].loading;
              return {
                ...restParams,
                data: data.map(item => ({
                  ...item,
                  goodsTypeName: GOODS_TYPES.find(i => i.id === item.goodsType)?.name,
                })),
              };
            }
            return this.store[curr];
          },
        },
      }),
      {},
    ),
  },
  async created() {},
  async mounted() {
    // this.store.init();
  },
};
